<template>
  <div class="qualityTest">
    <div class="title">质检记录</div>
    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true">
      <el-form-item label="申请人" prop="promoter">
        <el-select filterable clearable style="width: 100%;" v-model="queryParams.promoter" placeholder="请选择">
          <el-option v-for="item in userList" :key="item.value" :label="item.label" :value="item.value">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="el-icon-search" size="mini" @click="filterList">搜索</el-button>
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
      </el-form-item>
    </el-form>

    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button v-hasPermi="(['xmgl:quality:add'])" type="primary" plain icon="el-icon-plus" size="mini"
          @click="handleAdd">新增</el-button>
      </el-col>
    </el-row>

    <el-table v-loading="loading" row-key="id" ref="table" :data="tableData">
      <el-table-column label="序号" type="index" align="center">
      </el-table-column>
      <el-table-column label="申请人" align="center">
        <template slot-scope="scope">
          <dict-tag :value="scope.row.promoterId" :options="userList"></dict-tag>
        </template>
      </el-table-column>
      <el-table-column label="质检方式" align="center">
        <template slot-scope="scope">
          <dict-tag :options="dict.type.xmgl_task_qualitymethod" :value="scope.row.checkMethod"></dict-tag>
        </template>
      </el-table-column>
      <el-table-column label="质检类型" align="center">
        <template slot-scope="scope">
          <dict-tag :options="dict.type.xmgl_task_qualitytype" :value="scope.row.type"></dict-tag>
        </template>
      </el-table-column>
      <el-table-column label="检查负责人" align="center" prop="responsiblePerson">
      </el-table-column>
      <el-table-column label="检查状态" align="center">
        <template slot-scope="scope">
          <dict-tag :options="dict.type.xmgl_task_quality_status" :value="scope.row.status"></dict-tag>
        </template>
      </el-table-column>
      <el-table-column label="操作" align="center">
        <template slot-scope="scope">
          <el-button size="mini" type="text" icon="el-icon-view" @click="handleLook(scope.row)">查看</el-button>
          <el-button :disabled="isDisable(scope.row)" size="mini" type="text" icon="el-icon-edit"
            @click="handleUpdate(scope.row)">修改</el-button>
          <el-button :disabled="delDisable(scope.row)" v-hasPermi="(['xmgl:quality:remove'])" size="mini" type="text"
            icon="el-icon-delete" @click="handleDelete(scope.row)">删除</el-button>
          <el-button :disabled="comDisable(scope.row)" v-hasPermi="(['xmgl:quality:commit'])" size="mini" type="text"
            icon="el-icon-upload2" @click="submitForm(scope.row)">{{+scope.row.status >= 1 ? '已提交' : '提交' }}</el-button>
        </template>
      </el-table-column>
    </el-table>

    <!-- 弹框 -->
    <qualityModal @getList=getList ref="qualityModal"></qualityModal>
  </div>
</template>

<script>
import { commitQuality } from "@/api/project/quality.js";
import { getAllUserList } from "@/api/system/user";
import qualityModal from "./components/qualityModal.vue";
import { getQualityList, deleteQuality } from "@/api/project/quality";
export default {
  dicts: ['xmgl_task_qualitytype', 'xmgl_task_qualitymethod', 'xmgl_task_quality_status'],
  components: {
    qualityModal
  },
  data() {
    return {
      loading: false,
      tableData: [],
      queryParams: {},
      userList: []
    };
  },

  mounted() {
    this.getAllUserList();
    this.getList();
  },

  methods: {
    async getList() {
      this.loading = true;
      const res = await getQualityList(this.$route.query.taskId, this.queryParams);
      this.tableData = res.rows;
      this.loading = false;
    },
    // 获取所有用户
    async getAllUserList() {
      const res = await getAllUserList();
      this.userList = res.data.map(item => {
        return {
          value: item.value,
          label: item.name,
          raw: {
            listClass: ''
          }
        }
      })
    },
    filterList() {
      if (!this.queryParams.promoter) return;
      this.tableData = this.tableData.filter(item => item.promoterId === this.queryParams.promoter);
    },
    isDisable(row) {
      if (row.status === '0' && !this.$hasPermission('xmgl:quality:commit')) { // 创建只是已经创建，还没提交
        return true
      } else if (+row.status >= 6) {
        return true
      } else if (row.status === '4') { // 整改
        if (this.$hasPermission('xmgl:quality:commit')) {
          return false
        } else {
          return true
        }
      } else if ((+row.status > 0 && this.$hasPermission('xmgl:quality:commit'))) {
        return true
      }
    },
    delDisable(row) {
      if (+row.status >= 6) return true; // 已完成
      if (+row.status > 1 && !this.$hasPermission('xmgl:quality:commit')) return true; // 没有提交权限
      if (+row.status <= 1 && this.$hasPermission('xmgl:quality:commit')) return false; // 有提交权限
    },
    comDisable(row) {
      if (+row.status >= 1) return true; // 已经提交
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm("queryForm");
      this.getList();
    },
    handleUpdate(row) {
      this.$refs.qualityModal.openModal(row.id);
    },
    handleAdd() {
      this.$refs.qualityModal.openModal();
    },
    handleLook(row) {
      this.$refs.qualityModal.openModal(row.id, "look");
    },
    /** 删除按钮操作 */
    handleDelete(row) {
      this.$modal.confirm('是否确认删除选中的数据项？').then(() => {
        return deleteQuality(this.$route.query.taskId, row.id);
      }).then(() => {
        this.getList();
        this.$modal.msgSuccess("删除成功");
      }).catch(() => { });
    },
    /** 提交按钮，只用来编辑和添加 */
    async submitForm(row) {
      this.$modal.confirm('是否确认提交选中的数据项？').then(() => {
        if (row.status == '0') {
          return commitQuality(this.$route.query.taskId, row.id);
        }
      }).then(() => {
        this.getList();
        this.$modal.msgSuccess("提交成功");
      }).catch(() => { });
    },
  },
};
</script>

<style lang="scss" scoped>
.qualityTest {
  padding: 20px;

  .title {
    margin-bottom: 20px;
  }
}
</style>
